body
{
       /* L'image est positionnée en fond et est centrée */
    background: url(../image/souffleurelarue.jpg) no-repeat center;
    /* Ajout de la propriété avec les préfixes pour tous les moteurs de rendu */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    margin: 0 0 0 0;
    height: 85vh;
}

header
{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    vertical-align: center;
    height: 65px;
    color: rgba(0, 0, 0, 0.7);
    background-color: rgba(255, 255, 255, 1);
    
}

header h1
{
    font-size: 1.5em;
    font-weight: normal;
    margin: 20px 0 20px 10%;
    min-height: 25px;
}

section  
{
    display: flex; 
    flex-direction: column; 
    justify-content: space-between;   
    height: 80vh ;
    top: 75px;
}

aside
{
    padding-left: 10%;
}

aside h1
{
    font-size: 5.2em;
    color: rgba(70, 70, 70, 0.9);
}

aside h2
{
    color: rgba(70, 70, 70, 0.9);
}


#conteneur_compte
{
    display: flex;
    justify-content: flex-end;
}

#compteouverture
{
    display: block;
    font-size: 2.0em;
    max-width: 400px;
    min-height: 50px;
    padding: 10px 55px 5px 55px;
    margin: 225px 125px 0 0;
    color: rgba(255, 255, 255, 1);
    background-color: rgba(0, 128, 255, 0.5);
    border-radius: 8px 8px 8px 8px;
    
}

#compteouverture:hover 
{
    margin: 220px 125px 0 0;
    cursor: pointer;
}


#compteouverture a
{
    color: rgba(255, 255, 255, 1);
}


ul
{
    list-style-type: none;
    display: flex;
}

nav
{
    min-height: 100%;
}

nav ul
{
    list-style-type: none;
    display: flex;
}

nav a
{
    display: block;
    margin: 5px 75px 5px 0;
    padding: 5px 15px 5px 15px;
    text-align: left;
    background-color:  rgba(0, 150, 255, 0.5);
    color: rgba(255, 255, 255, 1)
    border-radius: 4px 4px 4px 4px;
    font-size: 1.2em;
    
    padding-bottom: 3px;
    text-decoration: none;
}

nav a:hover
{
    margin: 2px 75px 8px 0;
    cursor: pointer;
}

footer
{
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0px;
}

footer li
{
    padding: 5px 15px 5px 15px;
}

footer ul
{
   margin-right: 0px;
}

a
{
    text-decoration: none;
}

@media screen and (max-width: 1280px)
{
    
    aside h1
    {
       font-size:  3.2em;
    }
    #compteouverture
    {
        margin: 0 0 0 0;
    }
    #compteouverture:hover 
    {
        margin: 0 0 0 0;
    }

}
